<h1>hello excel {{xxx}} page!</h1>
<a href="#todo">click to todo</a>
<button onclick="F(AA1=!AA1)">toggle</button>
<div display="=AA1">abcde</div>
<form>
  <table border=1 cellspacing=0 cellpadding=3>
    <tr>
      <td></td>
      <td>a</td>
      <td>b</td>
      <td>c</td>
    </tr>
    <tr>
      <td>line1</td>
      <td id="A1" type="radio">
        <input name="A1" type="radio" value="0"/>0
        <input name="A1" type="radio" value="1" checked/>1
        <input name="A1" type="radio" value="2"/>2
        <input name="A1" type="radio" value="3"/>3
      </td>
      <td><input id="B1" value="4"/></td>
      <td><input id="C1" value="7"/></td>
    </tr>
    <tr>
      <td>line2</td>
      <td><select id="A2" multiple>
        <option value="1">1</option>
        <option value="2" selected>2</option>
        <option value="3">3</option>
        <option value="4">4</option>
      </select></td>
      <td><input id="B2" value="5"/></td>
      <td><input id="C2" value="8"/></td>
    </tr>
    <tr>
      <td>line3</td>
      <td><input id="A3" value="3"/></td>
      <td><input id="B3" value="6"/></td>
      <td><input id="C3" value="9"/></td>
    </tr>
    <tr>
      <td>SUM, SAMEAS</td>
      <td id="A4"></td>
      <td id="B4"></td>
      <td id="C4"></td>
    </tr>
    <tr>
      <td>SUM</td>
      <td id="A5"></td>
    </tr>
    <tr>
      <td>VLOOKUP</td>
      <td id="A6"></td>
      <td><input id="B6" value="2"></td>
    </tr>
    <tr>
      <td>ABS</td>
      <td id="A7"></td>
      <td><input id="B7" value="-11"/></td>
    </tr>
    <tr>
      <td>ACOS</td>
      <td id="A8"></td>
      <td><input id="B8" value="0.5"/></td>
    </tr>
    <tr>
      <td>ADDRESS</td>
      <td id="A9"></td>
    </tr>
    <tr>
      <td>AND</td>
      <td id="A10"></td>
      <td><input id="B10" value="2"/></td>
    </tr>
    <tr>
      <td>AVERAGE</td>
      <td id="A11"></td>
    </tr>
    <tr>
      <td>CONCATENATE</td>
      <td id="A12"></td>
    </tr>
    <tr>
      <td>COS</td>
      <td id="A13"></td>
    </tr>
    <tr>
      <td>COUNT</td>
      <td id="A14"></td>
    </tr>
    <tr>
      <td>COUNTA</td>
      <td id="A15"></td>
    </tr>
    <tr>
      <td>COUNTIF</td>
      <td id="A16"></td>
    </tr>
    <tr>
      <td>DATE</td>
      <td id="A17"></td>
      <td><input id="B17"/></td>
      <td><input id="C17"/></td>
      <td><input id="D17"/></td>
    </tr>
    <tr>
      <td>DATEDIF</td>
      <td id="A18"></td>
      <td><input id="B18"/></td>
      <td><input id="C18"/></td>
    </tr>
    <tr>
      <td>DAY</td>
      <td id="A19"></td>
    </tr>
    <tr>
      <td>FIND</td>
      <td id="A20"></td>
      <td><textarea id="B20">hello world!</textarea></td>
    </tr>
    <tr>
      <td>IF</td>
      <td id="A21"></td>
    </tr>
    <tr>
      <td>INDEX</td>
      <td id="A22"></td>
    </tr>
    <tr>
      <td>INT</td>
      <td id="A23"></td>
    </tr>
    <tr>
      <td>LEFT</td>
      <td id="A24"></td>
    </tr>
    <tr>
      <td>LEN</td>
      <td id="A25"></td>
    </tr>
    <tr>
      <td>MATCH</td>
      <td id="A26"></td>
    </tr>
    <tr>
      <td>MAX</td>
      <td id="A27"></td>
    </tr>
    <tr>
      <td>MID</td>
      <td id="A28"></td>
      <td id="B28"></td>
    </tr>
    <tr>
      <td>MOD</td>
      <td><input type="checkbox" id="A29"/></td>
      <td><input id="B29" value="9"/></td>
      <td><input id="C29" value="5"/></td>
    </tr>
    <tr>
      <td>MIN</td>
      <td id="A30" type="radio">
        <input name="A30" type="radio" value="0"/>0
        <input name="A30" type="radio" value="1"/>1
        <input name="A30" type="radio" value="2"/>2
        <input name="A30" type="radio" value="3"/>3
        <input name="A30" type="radio" value="4"/>4
      </td>
      <td><select id="B30">
        <option value="0">0</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
      </select></td>
    </tr>
    <tr>
      <td>MONTH</td>
      <td id="A31"></td>
    </tr>
    <tr>
      <td>NOW</td>
      <td id="A32"></td>
    </tr>
    <tr>
      <td>OR</td>
      <td id="A33"></td>
    </tr>
    <tr>
      <td>PRODUCT</td>
      <td id="A34"></td>
    </tr>
    <tr>
      <td>REPLACE</td>
      <td id="A35"></td>
    </tr>
    <tr>
      <td>RIGHT</td>
      <td id="A36"></td>
    </tr>
    <tr>
      <td>SEARCH</td>
      <td id="A37"></td>
    </tr>
    <tr>
      <td>SIN</td>
      <td id="A38"></td>
    </tr>
    <tr>
      <td>SUBTOTAL</td>
      <td id="A39"></td>
      <td><input id="B39" value="1"/></td>
    </tr>
    <tr>
      <td>SUMIF</td>
      <td id="A40"></td>
      <td><input id="B40" value="2"/></td>
    </tr>
    <tr>
      <td>STDEV</td>
      <td id="A41"></td>
    </tr>
    <tr>
      <td>TEXT</td>
      <td id="A42"></td>
    </tr>
    <tr>
      <td>TODAY</td>
      <td id="A43"></td>
    </tr>
    <tr>
      <td>VALUE</td>
      <td id="A44"></td>
      <td><input id="B44" value="2ok"/></td>
    </tr>
    <tr>
      <td>VAR</td>
      <td id="A45"></td>
    </tr>
    <tr>
      <td>VARP</td>
      <td id="A46"></td>
    </tr>
    <tr>
      <td>WEEKDAY</td>
      <td id="A47"></td>
    </tr>
    <tr>
      <td>array</td>
      <td>
        <ul id="A48">
          <li></li>
        </ul>
      </td>
    </tr>
    <tr>
      <td>obj</td>
      <td id="A49">
        <div name="name"></div>
        <div name="title"></div>
      </td>
    </tr>
    <tr>
      <td>array / obj</td>
      <td id="A50">
        <div type="obj">
          <span name="0"></span>
          <span style='color:red' name="1"></span>
        </div>
      </td>
    </tr>
  </table>
  <input type="reset"/>
</form>
<button onclick="changeString()">changeString</button>
<script src="../../exceljs/example/jsob_core.js"></script>
<script src="excel.js"></script>
<script src="https://cdn.wilddog.com/sdk/js/current/wilddog.js"></script>
<script src="js/router.js"></script>

<script>
  var space = 'excel';

  ROUTER.addEvent(space, {
    init: function(scope){
      scope.xxx      = '123';
      scope.is_show  = true;
      scope.mytoggle = function(){
        scope.is_show = !scope.is_show;
      };
    },
    load: function(){
      EXCEL && EXCEL.begin(space);
    }
  });

  EXCEL.addPage(space, {
    'A4' : '=SUM(A0:A3)',
    'B4' : '=SAMEAS(A4)',
    'C4' : '=SAMEAS(A4)',
    'A5' : '=SUM(A4:C4)',
//    'A6' : '=VLOOKUP(B6, A1:B4, 2)',
//    'A7' : '=ABS(B7)',
//    'A8' : '=ACOS(B8)',
//    'A9' : '=ADDRESS(1,8)',
//    'A10': '=AND(2>1, B10==2)',
//    'A11': '=AVERAGE(B1:B4)',
//    'A12': '=CONCATENATE(B1:B4)',
//    'A13': '=COS(A8)',
//    'A14': '=COUNT(B1:B13)',
//    'A15': '=COUNTA(B1:B13)',
//    'A16': "=COUNTIF(B1:B13, '>0')",
//    'B17': '=(new Date).getYear()+1900',
//    'C17': '=(new Date).getMonth()+1',
//    'D17': '=(new Date).getDate()',
//    'A17': '=DATE(B17, C17, D17)',
//    'A18': '=DATEDIF(B18, C18)',
//    'B18': '2015-9-22',
//    'C18': '2015-10-22',
//    'A19': '=DAY(B18)',
//    'A20': "=FIND('world', B20, 3)",
//    'A21': "=IF(A19>20, '>20', '<=20')",
//    'A22': '=INDEX(A1:C20, 2, 3)',
//    'A23': '=INT(A8)',
//    'A24': '=LEFT(B20, 5)',
//    'A25': '=LEN(A24)',
//    'A26': '=MATCH(3, A1:C3, -1)',
//    'A27': '=MAX(A1:C3, 4)',
//    'A28': '=MID(A24, 2, 2)',
//    'B28': '=B20.substring(2)',
//    'B29': '=A4',
//    'A29': '=MOD(B29, C29)',
//    'A30': '=A29',//'MIN(A1:C3, 4)',
//    'B30': '=A30',
//    'A31': '=MONTH(B18)',
//    'A32': '=NOW()',
//    'A33': '=OR(2>1, B10!=2)',
//    'A34': '=PRODUCT(A1:B3)',
//    'A35': "=REPLACE(B20, 'world', 'myworld')",
//    'A36': '=RIGHT(A35, 6)',
//    'A37': '=SEARCH("o", A35, 6)',
//    'A38': '=SIN(A8)',
//    'A39': '=SUBTOTAL(B39, A1:C3)',
//    'A40': "=SUMIF(A1:C3, '>B40')",
//    'A41': '=STDEV(A1:C3)',
//    'A42': "=TEXT(A41, '@0.00')",
//    'A43': '=TODAY()',
//    'A44': '=VALUE(B44)',
//    'A45': '=VAR(A1:C3)',
//    'A46': '=VARP(A1:C3)',
//    'A47': '=WEEKDAY(A43)',
//    'A48': '=TOARRAY(A40:C47,2,3,5,7)',
//    'A49': f49,
//    'A50': f50,
//    'AA1': false
  });

  //    ref = new Wilddog("https://bxyyy.wilddogio.com/" + space);
  //    bindL2R('B28', 'desc');
  //    bindR2L('desc', 'B44');

  function f49(){
    return {
      name : 'abc',
      title: 'ddd'
    };
  }

  function f50(){
    return [
      ['A1', 'A2'],
      ['B1', 'B2']
    ];
  }

  $(function(){
    //绑定事件代理
    $.body.mousedown(function(eobj){
      var target = eobj.target;
      var goal   = target.EOBJ;
      if(goal && goal.source_fn){
        if(!EXCEL.PROMPT){
          var IW       = $.IW();
          var IH       = $.IH();
          var div      = $.C($.body, {
            P : 'fixed',
            L : 20,
            T : 20,
            W : IW / 2,
            H : IH * 0.3,
            BG: '#333',
            BD: '#000'
          });
          div.drag     = $.C(div, {
            L : 0,
            T : 0,
            W : div.W_,
            H : 30,
            I : 'drag',
            BG: '#666',
            TA: 'center',
            C : '#FFF'
          }).DRAG({goal: div})
          div.textarea = $.C(div, {
            L: 20,
            T: 50,
            W: div.W_ - 50,
            H: div.H_ - 120,
            F: 18
          }, 'textarea').keydown(function(eobj){
            if(eobj.KEYCODE == 13){
              div.ok.MOUSEDOWN();
            }
          }, 1);

          var w        = IW / 10;
          div.ok       = $.C(div, {
            L: w,
            T: div.H_ - 50,
            W: w,
            H: 30,
            I: 'OK'
          }, 'button').mousedown(function(eobj){
            var newfn = eobj.FATHER.textarea.val();
            if(newfn != goal.source_fn && newfn !== null){
              goal.last_fn = goal.source_fn;
              goal.context.setAttribute('fn', newfn);
              EXCEL.begin();
            }
            eobj.FATHER.H();
          }, 1);
          div.cancel   = $.C(div, {
            L: w * 3,
            T: div.H_ - 50,
            W: w,
            H: 30,
            I: 'Cancel'
          }, 'button').mousedown(function(eobj){
            eobj.FATHER.H();
          }, 1);
          EXCEL.PROMPT = div.H();
        }

        EXCEL.PROMPT.V();
        EXCEL.PROMPT.textarea.val(goal.source_fn || goal.context.value || goal.context.innerHTML);
      }
    }, 1);

    document.forms[0].reset();

  });
</script>